Vue.createApp({
    data() {
        return {
            kaptchaUrl: '/kaptcha',
            kaptcha: '',
            phone: '',
            queryHint: '',
            tableTitle: '',
            tableData: []
            // tableData: {
            //     userName: '',
            //     phone: '',
            //     time: '',
            //     status: '',
            //     groupName: '',
            //     blockName: '',
            //     senderPhone: '',
            //     detail: ''
            // }
        }
    },
    methods: {
        refreshKaptcha() {
            this.kaptchaUrl = '/kaptcha?' + Math.floor(Math.random() * 100);
        },
        async query() {
            if (!(new RegExp("^\\d{11}$")).test(this.phone)) {
                this.queryHint = "请正确输入账号(11位数字)";
                return;
            }

            let pass = false;
            await axios.post("/kaptcha?code=" + this.kaptcha).then((resp) => {
                if (resp.data === true) {
                    pass = true;
                } else {
                    this.queryHint = resp.data;
                }
            });
            if (!pass) {
                this.refreshKaptcha();
                return;
            }

            axios.get("/query/data?phone=" + this.phone).then((resp) => {
                this.queryHint = "查询成功！";
                this.tableTitle = "收货号码: " + this.phone;
                this.tableData = resp.data;
                this.refreshKaptcha();
            });

        }
    }
}).mount("#query-app");